<template>
  <div class="table-bg">
    <div>
      <div class="table-title">附表一 演练情况统计表</div>
      <ColumnTable
        :tableColumn="attachedTable1"
        :tableData="dutyDailyDrillList"
        :showIndex="true"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表二 资源核查问题数量统计表</div>
      <ColumnTable
        :tableColumn="attachedTable2"
        :tableData="dutyDailyResourceList"
        :showIndex="true"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表三 电网生产相关专业员工感染情况统计表</div>
      <el-table
        :data="dutyDailyInfectionStatusList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
        :header-cell-style='{
          textAlign: "center",
          backgroundColor: "#B1C8F9",
          border: "1px solid #ccc",
          fontSize: "16px",
          color: "#333"
        }'
        :span-method="objectSpanMethod"
      >
        <el-table-column prop="unit" label="单位" align="center">
          <template slot-scope="scope">
            <el-input
              v-if="isShow"
              v-model="scope.row.unit"
              size="small"
            ></el-input>
            <span v-else>{{ scope.row.unit }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="infection" label="感染情况" align="center">
        </el-table-column>
        <el-table-column label="合计" align="center">
          <el-table-column
            prop="marketingExistingDiagnosis"
            label="新增"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{
                getAddNum(scope.row)
              }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="marketingExistingSuspected"
            label="现有"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{
                getExistingNum(scope.row)

              }}</span>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="电网调度" align="center">
          <el-table-column
            prop="dispatchNewlyIncreased"
            label="新增"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.dispatchNewlyIncreased"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.dispatchNewlyIncreased }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="dispatchExisting"
            label="现有"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.dispatchExisting"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.dispatchExisting }}</span>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="运维检修" align="center">
          <el-table-column
            prop="opNewlyIncreased"
            label="新增"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.opNewlyIncreased"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.opNewlyIncreased }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="opExisting" label="现有" align="center">
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.opExisting"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.opExisting }}</span>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="营销服务" align="center">
          <el-table-column
            prop="marketingNewlyIncreased"
            label="新增"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.marketingNewlyIncreased"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.marketingNewlyIncreased }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="marketingExisting"
            label="现有"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.marketingExisting"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.marketingExisting }}</span>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="电网建设" align="center">
          <el-table-column
            prop="constructionNewlyIncreased"
            label="新增"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.constructionNewlyIncreased"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.constructionNewlyIncreased }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="constructionExisting"
            label="现有"
            align="center"
          >
            <template slot-scope="scope">
              <el-input
                v-if="isShow"
                type="number"
                v-model="scope.row.constructionExisting"
                size="small"
                oninput="value=value.replace(/[^0-9]/g,'')
                if(value.indexOf('0') == 0 && value.indexOf('.') !== -1) { value=value.slice(0) }
                if(value.indexOf('0') == 0 && value.indexOf('.') === -1 && value.length > 1) { value=value.slice(1) }"
              ></el-input>
              <span v-else>{{ scope.row.constructionExisting }}</span>
            </template>
          </el-table-column>
        </el-table-column>
      </el-table>
    </div>
    <div>
      <div class="table-title">附表四 疫情防控供电保障情况统计表</div>
      <ColumnTable
        :tableColumn="attachedTable4"
        :tableData="dutyDailyEpidemicSituationList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表五 入境筛查和集中观察场所供电保障情况表</div>
      <ColumnTable
        :tableColumn="attachedTable5"
        :tableData="dutyDailyInboundList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表六 公司各单位预警响应情况</div>
      <ColumnTable
        :tableColumn="attachedTable6"
        :tableData="dutyDailyWarningResponseList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表七 公司各单位应急响应情况</div>
      <ColumnTable
        :tableColumn="attachedTable7"
        :tableData="dutyDailyEmergencyResponseList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表八 变电站停运及恢复情况</div>
      <ColumnTable
        :tableColumn="attachedTable8"
        :tableData="dutyDailyTransformerSubstationRecoverList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表九 输配电线路停运及恢复情况</div>
      <ColumnTable
        :tableColumn="attachedTable9"
        :tableData="dutyDailyLineFrankelList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">附表十 台区、用户停电及恢复情况</div>
      <ColumnTable
        :tableColumn="attachedTable10"
        :tableData="dutyDailyOutageList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">
        附表十一 线路覆冰总体情况统计表（仅11月-次年3月报送）
      </div>
      <ColumnTable
        :tableColumn="attachedTable11"
        :tableData="dutyDailyIcingOverallSituationList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">
        附表十二 线路覆冰详细情况统计表（仅11月-次年3月报送）
      </div>
      <ColumnTable
        :tableColumn="attachedTable12"
        :tableData="dutyDailyRouteIcingList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">
        附表十三 超预警水位变电站数量统计表（仅6月-9月报送）
      </div>
      <ColumnTable
        :tableColumn="attachedTable13"
        :tableData="dutyDailySurpassTransformerSubstationList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">
        附表十四 超预警水位线路数量统计表（仅6月-9月报送）
      </div>
      <ColumnTable
        :tableColumn="attachedTable14"
        :tableData="dutyDailySurpassLineList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
    <div>
      <div class="table-title">
        附表十五 超预警风力线路数量统计表（仅7月-9月报送）
      </div>
      <ColumnTable
        :tableColumn="attachedTable15"
        :tableData="dutyDailyLineNumberList"
        style="width: 100%"
        border
        :cell-style="{ borderColor: '#D7D7D7' }"
      />
    </div>
  </div>
</template>
<script>
import ColumnTable from "../columnTable";
import {
  attachedTable1,
  attachedTable2,
  attachedTable4,
  attachedTable5,
  attachedTable6,
  attachedTable7,
  attachedTable8,
  attachedTable9,
  attachedTable10,
  attachedTable11,
  attachedTable12,
  attachedTable13,
  attachedTable14,
  attachedTable15
} from "../columnTable/config";
import { getExistingNum, getAddNum} from "./confin";
export default {
  props: {
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  provide() {
    return {
      isShow: () => this.isShow
    };
  },
  components: {
    ColumnTable
  },
  data() {
    return {
      isShow: false,
      attachedTable1,
      attachedTable2,
      attachedTable4,
      attachedTable5,
      attachedTable6,
      attachedTable7,
      attachedTable8,
      attachedTable9,
      attachedTable10,
      attachedTable11,
      attachedTable12,
      attachedTable13,
      attachedTable14,
      attachedTable15,
      getExistingNum,
      getAddNum,
      dutyDailyDrillList: [{}],
      dutyDailyResourceList: [{}],
      dutyDailyInfectionStatusList: [{infection: "确诊" }, {infection: "治愈" }, {infection: "疑似" }],
      dutyDailyEpidemicSituationList: [{}],
      dutyDailyInboundList: [{}],
      dutyDailyWarningResponseList: [{}],
      dutyDailyEmergencyResponseList: [{}],
      dutyDailyTransformerSubstationRecoverList: [{}],
      dutyDailyLineFrankelList: [{}],
      dutyDailyOutageList: [{}],
      dutyDailyIcingOverallSituationList: [{}],
      dutyDailyRouteIcingList: [{}],
      dutyDailySurpassTransformerSubstationList: [{}],
      dutyDailySurpassLineList: [{}],
      dutyDailyLineNumberList: [{}]

    };
  },
  watch: {
    isEdit: {
      handler(val) {
        this.isShow = val;
      },
      immediate: true
    }
  },
  methods: {
    // 附表三 合并列
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        if (rowIndex % 3 === 0) {
          return [3, 1];
        } else {
          return [0, 0];
        }
      }
    },
    resetData() {
      this.dutyDailyDrillList = [{}];
      this.dutyDailyResourceList = [{}];
      this.dutyDailyInfectionStatusList = [{infection: "确诊" }, {infection: "治愈" }, {infection: "疑似" }];
      this.dutyDailyEpidemicSituationList = [{}];
      this.dutyDailyInboundList = [{}];
      this.dutyDailyWarningResponseList = [{}];
      this.dutyDailyEmergencyResponseList = [{}];
      this.dutyDailyTransformerSubstationRecoverList = [{}];
      this.dutyDailyLineFrankelList = [{}];
      this.dutyDailyOutageList = [{}];
      this.dutyDailyIcingOverallSituationList = [{}];
      this.dutyDailyRouteIcingList = [{}];
      this.dutyDailySurpassTransformerSubstationList = [{}];
      this.dutyDailySurpassLineList = [{}];
      this.dutyDailyLineNumberList = [{}];
    }
  }
};
</script>
<style lang="less" scoped>
.table-bg {
  background-color: #ecececbe;
  border: 1px solid #b6b6b6;
  border-radius: 6px;
  box-sizing: border-box;
  padding: 10px;
  margin-top: 20px;
  height: 500px;
  overflow-y: auto;
  .table-title {
    font-size: 18px;
    padding: 10px 0;
  }

  :deep(.el-input__inner) {
    background-color: transparent;
  }

  :deep(.el-table--border, .el-table--group) {
    border-color: #d7d7d7;

    &::after {
      background-color: #d7d7d7;
    }
  }
}
</style>
